<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8" />
        <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
        <meta name="renderer" content="webkit" />
        <title>黄先生</title>
        <link href="css/home.css" rel="stylesheet" type="text/css" />
        <link href="css/default.css" rel="stylesheet" type="text/css" />
        <link href="css/responsive.css" rel="stylesheet" type="text/css" />
        <link href="css/animations.css" rel="stylesheet" type="text/css" />
        <link href="css/swiper.min.css" rel="stylesheet" type="text/css" />
        <script src="js/jquery-1.9.1.min.js" type="text/javascript"></script>
        <script src="js/jquery.js" type="text/javascript"></script>
        <script src="js/swiper.min.js"></script>
    </head>

    <style type="text/css">
        .swiper-slide {
            text-align: center;
        }
        .text p {
            text-align: justify;
            padding-bottom: 20px;
        }
        .swiper-button-next.next,
        .swiper-button-prev.prev {
            top: 550px;
        }
    </style>

    <body id="idElement1" style="width: 1016px;">
        <!-- Like Social & Navigation. Bitch. -->
        <nav style="height: 629px;">
            <a href="#idElement1" class="Smooth"
                ><h1 class="animation" style="white-space: nowrap;">
                    黄先生<span style="padding-left: 10px; font-size: 20px;">Huang Xiansheng</span>
                </h1></a
            >
            <h2 id="AboutBar" class="animation">ABOUT ME</h2>
            <ul>
                <a href="#idElement2" class="Smooth green">
                    <li class="Past animation">个人资料</li>
                </a>
                <a href="#idElement3" class="Smooth green">
                    <li class="Hobbies animation">兴趣爱好</li>
                </a>
            </ul>
            <h2 id="ProjectBar" class="animation">PROJECTS / WORK</h2>
            <ul>
                <a href="#idElement4" class="Smooth purple">
                    <li class="animation">网页设计</li>
                </a>
                <a href="#idElement5" class="Smooth purple">
                    <li class="animation">平面设计</li>
                </a>
                <!-- <a href="#idElement6" class="Smooth purple">
                <li class="animation">书籍封面设计</li>
            </a>
            <a href="#idElement7" class="Smooth purple">
                <li class="animation">APP图标设计</li>
            </a>
            <a href="#idElement8" class="Smooth purple">
                <li class="animation">APP界面设计</li>
            </a> -->
            </ul>
            <a href="#idElement10" class="Smooth"><h2 id="end" class="animation">END</h2></a>
        </nav>
        <div id="navGradient"></div>
        <!-- Like Finally. Content Mr. White. -->
        <div class="content" style="height: 397px; padding-top: 0;">
            <!-- Slider main container -->
            <div class="swiper-container">
                <!-- Additional required wrapper -->
                <div class="swiper-wrapper">
                    <!-- Slides -->
                    <div class="swiper-slide">
                        <img src="images/web_01.jpg" />
                    </div>
                    <div class="swiper-slide">
                        <img src="images/web_02.jpg" />
                    </div>
                    <div class="swiper-slide">
                        <img src="images/web_03.jpg" />
                    </div>
                </div>
                <!-- If we need pagination -->
                <div class="swiper-pagination"></div>
                <!-- If we need navigation buttons -->
                <div class="swiper-button-prev"></div>
                <div class="swiper-button-next"></div>
            </div>
        </div>
        <div id="idElement2" class="content past_present" style="height: 397px;">
            <h1 class="align_fix">目前状态</h1>
            <p style="margin-left: 70px;">工作中</p>
            <h1>个人评价</h1>
            <div class="swiper-container" style="max-width: 800px; margin: 0 0 0 70px;">
                <!-- Additional required wrapper -->
                <div class="swiper-wrapper">
                    <!-- Slides -->
                    <div class="swiper-slide text">
                        <p>
                            20世纪初的一天，圣诞节快到了，在美国西部的一座小城，一个十岁左右的小男孩捏着一枚1美元的硬币，沿街一家一家商店地询问：“请问,
                            您这儿有上帝卖吗？”店主要么说没有，要么认为他是在搞乱，不由分说就把他赶出了店门。
                        </p>
                        <p>天快黑时，小男孩顽强地向第69家商店的店主开了口：“请问, 您这儿有上帝卖吗？”</p>
                        <p>
                            老板是个60多岁，满头银发，慈眉善目的老头，他笑眯眯地问小男孩：“告诉我，孩子，你买上帝干吗？”
                        </p>
                        <p>
                            有人回应，小男孩激动地流出眼泪，对老板说，自己的父母很早就去世了，现在是叔叔养着他。叔叔在建筑工地工作，前不久从脚手架上摔了下来，至今昏迷不醒。医生说，只有上帝才能救他。小男孩想，上帝一定是种非常奇妙的东西。
                        </p>
                    </div>
                    <div class="swiper-slide text">
                        <p>“我把上帝买回来，让叔叔吃了，伤就会好。”</p>
                        <p>听完小男孩的叙述，老板的眼圈也湿润了，问：“你有多少钱？”</p>
                        <p>“1美元。”</p>
                        <p>“孩子，眼下上帝的价格正好是1美元。”</p>
                        <p>
                            老板接过小男孩手中的硬币，从货架上拿了一瓶“上帝之吻”牌饮料，对小男孩说：“拿去吧，孩子，你叔叔喝了这瓶‘上帝’，就没事了。”
                        </p>
                        <p>
                            小男孩喜出望外，紧紧将饮料抱在怀里，兴冲冲地奔赴医院。一进病房，他就开心地叫嚷道：“叔叔，我把上帝买回来了，你很快就会好起来！”
                        </p>
                    </div>
                    <div class="swiper-slide text">
                        <p>
                            第二天，一个由世界上顶尖医学专家组成的医疗小组乘专机来到这个小城市，奔赴小男孩叔叔所在的医院，对小男孩的叔叔进行了联合会诊。很快，小男孩的叔叔就被救好。
                        </p>
                        <p>
                            但当小男孩的叔叔出院时，看到天价的医疗费账单时，又差点昏过去。不过，医院方很快打消了他的疑虑，说有个叫邦迪的老富翁已经帮他付清了钱，医疗队也是邦迪花费重金找来的。
                        </p>
                        <p>
                            后来，叔叔才知道，邦迪是一位亿万富翁，那家杂货店是邦迪的祖产，他没事就常来在此处打发时光。
                        </p>
                        <p>
                            小男孩的叔叔激动不已，立即和小男孩去杂货店感谢。店员告诉叔侄二人，老板已经出门旅游了，让他们无需挂怀，并将邦迪写的一封信给了小男孩的叔叔。
                        </p>
                    </div>
                    <div class="swiper-slide text">
                        <p>
                            小男孩的叔叔展开信：“年轻人，您不需要感谢我，所有的一切，您的侄儿都已经付清费用。我要说的是，您能有这个侄儿，实在是太幸运了。为了救您，他拿1美元到处购买上帝……感谢上帝，是他挽救了您的生命。但您一定要永远记住，真正的上帝，是人们的爱心！”
                        </p>
                        <p>
                            故事并没有到此结束。后来，那个到处买上帝的小男孩长大后，考进了医学院，为了感谢曾经救过他叔叔的亿万富翁邦迪，也是为了帮助更多意外受到伤害的人，他发明了创可贴，并用邦迪的命名之，以便大家记住他的故事，将爱心传递下去。
                        </p>
                        <p>
                            所以，我们要相信，这个世界是有奇迹存在的，而促使奇迹发生的最重要的因素，就是真挚的爱！人间有了真挚的爱，困难就会低头，奇迹就会发生，魔鬼也会逃逸。
                        </p>
                    </div>
                </div>
                <!-- If we need pagination -->
                <div class="swiper-pagination"></div>
                <!-- If we need navigation buttons -->
                <div class="swiper-button-prev prev"></div>
                <div class="swiper-button-next next"></div>
            </div>
        </div>
        <div id="idElement3" class="content hobbies" style="height: 397px; margin-top: 250px;">
            <h1 class="align_fix">兴趣爱好Hobbies</h1>
            <p></p>
            <ul>
                <li class="world">去人烟稀少的地方旅行感受宁静</li>
                <li class="gym">学习影视后期相关的知识</li>
                <li class="coffee">偶尔会和好友打打羽毛球联络情感</li>
                <li class="xbox">爬山也很有趣，站在山顶俯瞰一座城市</li>
            </ul>
        </div>
        <div id="idElement4" class="content gymApp_2" style="height: 397px; padding-top: 100px;">
            <!-- Slider main container -->
            <div class="swiper-container">
                <!-- Additional required wrapper -->
                <div class="swiper-wrapper">
                    <!-- Slides -->
                    <div class="swiper-slide">
                        <img src="images/wangzhan/7.jpeg" />
                    </div>
                    <div class="swiper-slide">
                        <img src="images/wangzhan/8.jpeg" />
                    </div>
                    <div class="swiper-slide">
                        <img src="images/wangzhan/12.jpeg" />
                    </div>
                    <div class="swiper-slide">
                        <img src="images/wangzhan/13.jpeg" />
                    </div>
                </div>
                <!-- If we need pagination -->
                <div class="swiper-pagination"></div>
                <!-- If we need navigation buttons -->
                <div class="swiper-button-prev"></div>
                <div class="swiper-button-next"></div>
            </div>
        </div>
        <div id="idElement5" class="content web2" style="height: 397px; padding-top: 100px;">
            <!-- Slider main container -->
            <div class="swiper-container">
                <!-- Additional required wrapper -->
                <div class="swiper-wrapper">
                    <!-- Slides -->
                    <div class="swiper-slide">
                        <img src="images/haibao/9.jpg" />
                    </div>
                    <div class="swiper-slide">
                        <img src="images/haibao/10.jpg" />
                    </div>
                    <div class="swiper-slide">
                        <img src="images/haibao/11.jpg" />
                    </div>
                    <div class="swiper-slide">
                        <img src="images/haibao/12.jpg" />
                    </div>
                    <div class="swiper-slide">
                        <img src="images/haibao/13.jpg" />
                    </div>
                </div>
                <!-- If we need pagination -->
                <div class="swiper-pagination"></div>
                <!-- If we need navigation buttons -->
                <div class="swiper-button-prev"></div>
                <div class="swiper-button-next"></div>
            </div>
        </div>
        <div id="idElement10" class="content web2" style="height: 397px;">
            <h1 class="align_fix">End</h1>
            <h1 style="text-align: center; margin-top: 15%;">欢迎再次访问</h1>
            <p style="text-align: center;">Welcome back again</p>
        </div>
        <div id="social">
            <ul>
                <li>(+86)185****0450</li>
                <li>huangxiansheng****@163.com</li>
            </ul>
        </div>
        <script type="text/javascript">
            $(function () {
                var mySwiper = new Swiper(".swiper-container", {
                    // Optional parameters
                    loop: true,
                    // If we need pagination
                    pagination: ".swiper-pagination",
                    // Navigation arrows
                    nextButton: ".swiper-button-next",
                    prevButton: ".swiper-button-prev",
                });

                var str = navigator.userAgent;
                var grep = /(IEMobile)|(MeeGo)|(Nokia)|(iPhone)|(Android)/;

                if (str.match(grep)) {
                    window.location.href = "m_index.html";
                }
            });
        </script>
        <script>
            var _hmt = _hmt || [];
            (function () {
                var hm = document.createElement("script");
                hm.src = "//hm.baidu.com/hm.js?4885d4801a9165728eb7f55c1584a298";
                var s = document.getElementsByTagName("script")[0];
                s.parentNode.insertBefore(hm, s);
            })();
        </script>
    </body>
</html>
